
$(function () {
    map();
    function map() {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('map'));

        var uploadedDataURL = "/重庆市智慧三农大数据平台/data(2).json";
        // var uploadedDataURL = "../data(2).json";
        myChart.showLoading();
        $.getJSON(uploadedDataURL,
            function (geoJson) {
                echarts.registerMap('jiangsu', geoJson);
                myChart.hideLoading();
                var geoCoordMap = {
                    "巴南区": [106.719423, 29.691919],

                };
                var merData = [
                    { name: '万州区', value: 109 },
                    { name: '涪陵区', value: 109 },
                    { name: '渝中区', value: 109 },
                    { name: '大渡口区', value: 109 },
                    { name: '江北区', value: 109 },
                    { name: '沙坪坝区', value: 109 },
                    { name: '九龙坡区', value: 109 },
                    { name: '南岸区', value: 109 },
                    { name: '北碚区', value: 109 },
                    { name: '綦江区', value: 109 },
                    { name: '大足区', value: 109 },
                    { name: '渝北区', value: 109 },
                    { name: '巴南区', value: 109 },
                    { name: '黔江区', value: 109 },
                    { name: '长寿区', value: 109 },
                    { name: '江津区', value: 109 },
                    { name: '合川区', value: 109 },
                    { name: '永川区', value: 109 },
                    { name: '南川区', value: 109 },
                    { name: '璧山区', value: 109 },
                    { name: '铜梁区', value: 109 },
                    { name: '潼南区', value: 109 },
                    { name: '荣昌区', value: 109 },
                    { name: '梁平区', value: 109 },
                    { name: '城口县', value: 109 },
                    { name: '丰都县', value: 109 },
                    { name: '垫江县', value: 109 },
                    { name: '武隆区', value: 109 },
                    { name: '忠县', value: 109 },
                    { name: '云阳县', value: 109 },
                    { name: '奉节县', value: 109 },
                    { name: '巫山县', value: 109 },
                    { name: '巫溪县', value: 109 },
                    { name: '石柱土家族自治县', value: 109 },
                    { name: '秀山土家族苗族自治县', value: 109 },
                    { name: '酉阳土家族苗族自治县', value: 109 },
                    { name: '彭水苗族土家族自治县', value: 109 },
                    { name: '开州区', value: 109 },
                ];

                var convertData = function (data) {
                    var res = [];
                    for (var i = 0; i < data.length; i++) {
                        var geoCoord = geoCoordMap[data[i].name];
                        if (geoCoord) {
                            res.push({
                                name: data[i].name,
                                value: geoCoord.concat(data[i].value)
                            });
                        }
                    }
                    return res;
                };
                var option = convertData(merData); // 确保在使用option之前已经定义了它
                option = {
                    title: {
                        text: '生产要素分布情况',
                        subtext: '',
                        left: 'center',
                        top: '40',
                        textStyle: {
                            color: '#fff'
                        }
                    },
                    tooltip: {
                        trigger: 'item'
                    },
                    legend: {
                        show: false,
                        orient: 'vertical',
                        y: 'bottom',
                        x: 'right',
                        data: ['credit_pm2.5'],
                        textStyle: {
                            color: '#fff'
                        }
                    },
                    // backgroundColor: '#0F2658',
                    geo: {
                        show: true,
                        map: 'jiangsu',
                        roam: false,
                        aspectScale: 1,
                        top: 100,
                        bottom: 100,
                        right: 140,
                        left: 140,
                        // top: 10,
                        // bottom: 30,
                        // right: 20,
                        // left: 20,
                        label: {
                            normal: {
                                show: false
                            },
                            emphasis: {
                                show: false
                            }
                        },
                        itemStyle: {
                            // 设置边框、地图区域色
                            normal: {
                                areaColor: '#114466',
                                borderWidth: 2,
                                // 设置外层边框
                                borderColor: '#0E96D8',
                                shadowColor: '#0E91D0',
                                shadowBlur: 10,
                                shadowOffsetX: -10,
                                shadowOffsetY: 8
                            },
                            emphasis: {
                                areaColor: '#114466',
                                color: '#fff'
                            }
                        }
                    },
                    series: [{
                        type: 'map',
                        map: '江苏',
                        geoIndex: 0,
                        aspectScale: 1.1,
                        // 长宽比
                        label: {
                            normal: {
                                show: true
                            },
                            emphasis: {
                                show: false,
                                textStyle: {
                                    color: '#fff'
                                }
                            }
                        },
                        itemStyle: {
                            normal: {
                                areaColor: '#0F4567',
                                borderColor: '#10A3E9'
                            },
                            emphasis: {
                                areaColor: '#0F4567'
                            }
                        },
                        animation: false,
                        data: merData
                    },
                    {
                        name: '点',
                        type: 'scatter',
                        coordinateSystem: 'geo',
                        silent: true,
                        symbol:
                            'image://https://dingling36.oss-cn-hangzhou.aliyuncs.com/scatter-light.png',

                        symbolSize: 120,
                        animation: true,
                        animationDuration: 1,
                        animationDurationUpdate: 1,
                        label: {
                            normal: {
                                formatter: function (params) {
                                    return params.name + '\n' + params.value[2];
                                },
                                position: [60,
                                    -13],
                                show: true,
                                textStyle: {
                                    color: '#fff',
                                    align: 'center',
                                    fontSize: 22,
                                    fontFamily: 'PingFang',
                                    fontWeight: 400,
                                    textShadowColor: '#0E91D0',
                                    textShadowBlur: 12,
                                    textShadowOffsetX: -8,
                                    textShadowOffsetY: -5
                                }
                            }
                        },
                        emphasis: {
                            label: {
                                color: '#E6A805',
                                textBorderColor: '#E6A805',
                                textShadowColor: '#8E792B',
                                textShadowOffsetX: -6,
                                textShadowOffsetY: -5,
                                textBorderWidth: 1
                            }
                        },
                        itemStyle: {
                            normal: {
                                color: '#F62157'
                            }
                        },

                        data: convertData(merData)
                    },
                    {
                        name: '点',
                        type: 'scatter',
                        coordinateSystem: 'geo',
                        silent: true,
                        symbol:
                            'image://https://dingling36.oss-cn-hangzhou.aliyuncs.com/scatter.png',
                        symbolSize: 120,
                        animation: true,
                        animationDurationUpdate: 1,
                        label: {
                            normal: {
                                formatter: function (params) {
                                    return '';
                                },
                                position: [60,
                                    -13],
                                show: true,
                                textStyle: {
                                    color: '#fff',
                                    align: 'center',
                                    fontSize: 22,
                                    fontFamily: 'PingFang',
                                    fontWeight: 400,
                                    textShadowColor: '#E6A805',
                                    textShadowBlur: 12,
                                    textShadowOffsetX: -8,
                                    textShadowOffsetY: -5
                                }
                            }
                        },
                        itemStyle: {
                            normal: {
                                color: '#F62157'
                            }
                        },
                        data: convertData(merData)
                    }]
                };

                var convertData = function (data) {
                    var res = [];
                    for (var i = 0; i < data.length; i++) {
                        var geoCoord = geoCoordMap[data[i].name];
                        if (geoCoord) {
                            res.push({
                                name: data[i].name,
                                value: geoCoord.concat(data[i].value)
                            });
                        }
                    }
                    return res;
                };

                myChart.setOption(option);
                window.addEventListener("resize", function () {
                    myChart.resize();
                });
            }
        );




    }

})

